<html>
<head>
<!--Load the AJAX API-->
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript" src="ajile/com.iskitz.ajile.js?mvcoff,mvcshareoff,refresh"></script>
<script type="text/javascript" src="org.wattdepot.gdata.GDataLoader.js"></script>
<script type="text/javascript" src="org.wattdepot.gdata.kukuicup.Configuration.js"></script>
<script type="text/javascript" src="org.wattdepot.gdata.makahiki.Standings.js"></script>
</head>

<body>
  <div id="standings1"></div>
  <p>
  <div id="standings2"></div>
</body>

 
<script type="text/javascript">
// Wrap this code in an anonymous self-invoking function to avoid polluting global namespace.
(function() {
  // This data structure must be generated by Makahiki.
  var standings1 = 
  {
    title : 'Dorm Energy Standings, Round 2',
    info : [{kWh : 1432, rank : 1, label : 'Ilima'},
	    {kWh : 1856, rank : 2, label : 'Lehua'},
	    {kWh : 2125, rank : 3, label : 'Mokihana'}],
    myindex : 2,
    type : 'group'
  }

  var standings2 = 
  {
    title : 'Dorm Energy Standings, Overall',
    info : [{kWh : 2432, rank : 1, label : 'Mokihana'},
	    {kWh : 2556, rank : 2, label : 'Lehua'},
	    {kWh : 3102, rank : 3, label : 'Ilima'}],
    type : 'group'
  }

  // Load the visualization API, then call displayDormData.
  var loader = new org.wattdepot.gdata.GDataLoader(displayStandings);  

  function displayStandings() {
    var configuration = new org.wattdepot.gdata.kukuicup.Configuration();
    var standingsChart = new org.wattdepot.gdata.makahiki.Standings(configuration);
    standingsChart.draw('standings1', standings1);
    standingsChart.draw('standings2', standings2);
    
  }
})();
</script>

</html>








